<template>
	<view class="conter">
		<header-box :title="title"></header-box>
		<view class="box1">

			<view class="flex-box data">
				<view class="">
					日期
				</view>
				<view class="flex-center">
					{{dataTime | formatDate4}}
					<!-- <view class="data-image">
						<image src="../../static/index/right.png" mode="widthFix"></image>
					</view> -->
				</view>
			</view>
			<view class="flex-box data">
				<view class="">
					仓库
				</view>
				<navigator url="/#" class="flex-center">
					{{stockName}}
					<view class="data-image">
						<!-- <image src="../../static/index/right.png" mode=""></image> -->
					</view>
				</navigator>
			</view>
		</view>



		<view class="box2">
			<block v-for="(item1, ind) in stockList" :key="ind">
				<view class="box3 flex-box" @click="addInpurNum(item1 , ind)">
					<view class="flex-box ">
						<view class="flex-center">
							<view class="">
								<image style="width: 100rpx; height: 100rpx;" :src="item1.image" mode=""></image>
							</view>
							<view class="" style="margin-left: 20rpx;">
								<view class="f30" style="font-weight: 600;">
									{{item1.name}}
								</view>
								<view class="f22 add-class">
									单位：{{item1.unit}}
								</view>
								<view class="f22">
									库存: {{item1.num}}
								</view>
							</view>
						</view>
					</view>
					<view class="">
						<view class="f26" style="color: #7278EC;font-weight: 500; font-family: PingFang SC;">
							已选: {{item1.mmm ? item1.mmm : 0}}
						</view>
					</view>
				</view>
				
			</block>
		</view>


		<view class="bor-bot flex-box">
			<!-- showPopup1 = true -->
			<view class="bor-bot1" @click="checkList">
				<view class="bor-image">
					<image src="../../static/stock/pandian.png" mode=""></image>
				</view>
				已盘点
			</view>
			<view class="bg-gradual-green sear-box">
				搜索
			</view>
		</view>





		<!-- 弹框输入数量 -->
		<u-popup v-model="showPopup" mode="center" width="580rpx" height="300rpx" border-radius="20">
			<view class="popup-title">
				盘点-{{remName}}
			</view>
			<view class="popup-box">
				<text>盘点数</text>
				<input type="text" v-model="num" placeholder="请输入" placeholder-style="padding-right: 0" />
			</view>
			<view class="popup-border flex-around">
				<view class="" @click="showPopup = false" style="background-color: #CCCCCC; border-radius: 30rpx;">
					取消
				</view>
				<view class="bg-gradual-green" style="border-radius: 30rpx;" @click="confir">
					确定
				</view>
			</view>
		</u-popup>



		<!-- 已盘点弹层 -->
		<u-popup v-model="showPopup1" mode="bottom" width="100%" border-radius="20">
			<view class="">
				<view class="flex-box shop-box">
					<text>已选商品</text>
					<text @click="removeInfo">清空</text>
				</view>
				<view class="box-shop">

					<view class="shopping-info" v-for="(item, index) in addlist" :key="index" @click="propShow">
						<view class="">
						</view>
						<view class="flex-box heig-shop">
							<view class="">
								{{item.name}}
							</view>
							<view class="">
								{{item.numberIfo}}
							</view>
						</view>
						<view class="">
							单位: {{item.unit}}
						</view>
					</view>
				</view>
				<view class="tottom flex-around">
					<view class="clas1" style="color: #7278EC; background-color: #FAFAFA;">
						合计: {{addNum ? addNum : 0}}
					</view>
					<navigator
						url="/#"
						class="clas1 bg-gradual-green" @tap="addGoinfo">
						确定
					</navigator>
				</view>
			</view>
		</u-popup>


	</view>
</template>

<script>
	import headerBox from '../../components/header/header.vue'

	export default {
		components: {
			headerBox
		},
		data() {
			return {
				title: '盘点单',
				texList: [],
				showPopup: false,
				showPopup1: false,
				stockId: '',
				stockList: [],
				stockName: '请选择仓库',
				check_id: '', // 盘点id
				remName: '',
				num: '',
				index: '',
				goodsId: '',
				StockNum: '',
				addlist: [],
				addNum: 0,
				dataTime: '',
				list: {},
				itemIfo: '',
			}
		},
		onLoad(e) {
			this.list = JSON.parse(e.item)
			this.stockName = this.list.name
			this.stockId = this.list.id
			console.log("res.data: ", this.stockId);
			console.log("res.data: ", this.list);

		},
		onShow() {
			// console.log('仓库ID', this.stockId)
			// console.log('仓库ID', this.stockName)
			this.getStockList()
			uni.setStorageSync('stockId', this.stockId);
			uni.setStorageSync('stockName', this.stockName);
			this.dataTime = Date.parse(new Date()) / 1000;
		},

		methods: {


			// 仓库列表
			async getStockList() {
				const res = await this.$u.post("api/jinxiao.Check/add?store_id=" + this.stockId)
				this.stockList = res.data

				// this.stockList = Object.values(res.data)
				// this.stockList = res.data.goods
				// this.check_id = res.data.check_id

				// uni.setStorageSync('check_id', this.check_id);

			},
			
			addGoinfo() {
				uni.setStorageSync("addlist", this.addlist)
				uni.navigateTo({
					url:'/pages/stock/inventory' 
				})
			},

			addInpurNum(item, index) {
				this.num = ''
				this.index = index
				this.remName = item.name
				this.goodsId = item.id
				this.StockNum = item.num
				this.showPopup = true
				this.itemIfo = item
			},


			// 确定
			async confir() {

				this.stockList[this.index].mmm = this.num
				// new Set()
				let arr = []
				arr.push(this.stockList[this.index])
				console.log("arr: ", arr);
				this.$forceUpdate()
				// if (this.num == '') return this.$tools.msg('请输入数量')
				// const res = await this.$u.post("api/Check/check", {
				// 	goods_id: this.goodsId,
				// 	check_id: this.check_id,
				// 	num: this.StockNum,
				// 	check_num: this.num,
				// })
				// this.$tools.msg(res.msg)
				
				this.itemIfo.numberIfo = this.num
				this.addlist.push(this.itemIfo)
				console.log('itemIfoitemIfoitemIfo',this.addlist)
				this.showPopup = false

			},


			// 查看以盘点的 ID
			async checkList() {
				this.showPopup1 = true
			},

			// 清空列表
			removeInfo() {
				this.addlist = []
				this.showPopup1 = false
				this.stockList.forEach((item,index, i) => {
					item.mmm = ''
				})
				console.log('this.stockList',this.stockList)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.conter {
		width: 100%;
		height: 100%;
		position: relative;
		padding-bottom: 100rpx;

		image {
			width: 100%;
			height: 100%;
		}

		.box1 {
			width: 90%;
			height: 182rpx;
			margin: 30rpx auto;
			padding: 0 35rpx;
			color: #333333;
			font-size: 28rpx;
			border-radius: 10rpx;
			background-color: #FFFFFF;

			.data {
				width: 100%;
				height: 86rpx;
				border-bottom: 1rpx solid #F0F0F0;

				.data-image {
					width: 22rpx;
					height: 36rpx;
					margin-left: 12rpx;
				}
			}

			.data:last-child {
				border-bottom: 0;
			}
		}

		.box2 {
			width: 90%;
			margin: 30rpx auto;
			padding: 0 35rpx;
			color: #333333;
			font-size: 28rpx;
			border-radius: 10rpx;
			background-color: #FFFFFF;

			.box3 {
				height: 180rpx;
				// padding-bottom: 30rpx;
				border-bottom: 1rpx solid #F0F0F0;
			}

			.box3:last-child {
				border-bottom: 0;
			}

			.box-center {
				height: 80rpx;
				color: #000000;
				font-weight: bold;
				line-height: 80rpx;
				display: flex;
				font-family: PingFang SC;
				justify-content: space-between;

			}

			.add-class {
				font-size: 26rpx;
				height: 50rpx;
				line-height: 50rpx;
			}
		}


		.bor-bot {
			position: absolute;
			bottom: 0;
			right: 0;
			width: 100%;
			height: 120rpx;
			z-index: 100;
			padding: 0 30rpx;
			background-color: #FFFFFF;

			.bor-bot1 {
				width: 30%;
				// margin: 0 auto;
				text-align: center;

				.bor-image {
					margin: 0 auto;
					width: 50rpx;
					height: 50rpx;
				}
			}
		}



		.sear-box {
			width: 60%;
			height: 70rpx;
			line-height: 70rpx;
			color: #FFFFFF;
			text-align: center;
			border-radius: 35rpx;
		}



		// 弹框
		.popup-title {
			height: 96rpx;
			font-size: 32rpx;
			text-align: center;
			line-height: 96rpx;
		}

		.popup-box {
			width: 80%;
			height: 70rpx;
			margin: 0 auto;
			display: flex;
			align-items: center;
			border-radius: 10rpx;
			padding-left: 20rpx;
			background-color: #F5F5F5;

			input {
				width: 80%;
				height: 100%;
				padding-left: 31rpx;
			}
		}

		.popup-border {
			display: flex;
			margin-top: 35rpx;

			view {
				width: 30%;
				height: 60rpx;
				color: #FFFFFF;
				text-align: center;
				line-height: 60rpx;
			}
		}


		.shop-box {
			width: 100%;
			height: 98rpx;
			line-height: 98rpx;
			padding: 0 30rpx;
			font-size: 24rpx;
			background-color: #F5F5FA;
			font-family: PingFang SC;
		}

		.box-shop {
			width: 100%;
			padding: 0 30rpx;

			.shopping-info {
				border-bottom: 1rpx solid #F5F5F5;

				.heig-shop {
					height: 70rpx;
					line-height: 70rpx;
				}
			}

			.shopping-info:last-child {
				border-bottom: 0;
			}
		}

		.tottom {
			height: 90rpx;
			display: flex;
			align-items: center;
			margin-top: 50rpx;
			justify-content: space-around;

			.clas1 {
				width: 50%;
				height: 90rpx;
				line-height: 90rpx;
				text-align: center;
			}

		}
	}
</style>
